import SignUpBtn from './SignUpBtn'

export default function Work() {
  return (
    <div className="bg-white">
      <div className="max-w-6xl w-full mx-auto py-20 sm:px-6 lg:px-8">
        <div className="mx-auto text-center">
          <h2 className="text-4xl font-bold tracking-tight text-gray-900 sm:text-5xl">Why use RedGrowth?</h2>
          <div className="mt-12 grid grid-cols-1 md:grid-cols-2 gap-8">
            <div className="bg-red-200 shadow-md rounded-lg overflow-hidden">
              <div className="p-6">
                <h3 className="text-xl font-semibold text-gray-900">
                  To find customers <span className="bg-gray-900 text-white">manually</span> you need:
                </h3>
                <ul className="mt-4 space-y-2 list-disc pl-5 py-2 pr-2">
                  <li className="text-left text-red-700 text-lg">
                    Monitor on Reddit every few hours, searching for keywords related to your product (15 - 30 min)
                  </li>
                  <li className="text-left text-red-700 text-lg">
                    Read every mention and analyze whether you can offer your product (15 - 30 min)
                  </li>
                  <li className="text-left text-red-700 text-lg">
                    Write a personal text for each suitable mention in which your product will be mentioned (30 - 60
                    min)
                  </li>
                  <h4 className="mt-2 text-xl font-semibold text-gray-900 text-left">
                    Total: <span className="bg-gray-900 text-white">1 - 2 hours per day</span> for 1 project
                  </h4>
                </ul>
              </div>
            </div>
            <div className="bg-green-200 shadow-md rounded-lg overflow-hidden">
              <div className="p-6">
                <h3 className="text-xl font-semibold text-gray-900">
                  To get leads using <span className="bg-gray-900 text-white">RedGrowth</span> you need:
                </h3>
                <ul className="mt-4 space-y-2 list-disc pl-5 py-2 pr-2">
                  <li className="text-left text-green-700 text-lg">
                    Create a project and add keywords (AI will suggest suitable keywords for your product)
                  </li>
                  <h4 className="mt-2 text-xl font-semibold text-gray-900 text-left">
                    Total: <span className="bg-gray-900 text-white">2 minutes one time</span> for 1 project
                  </h4>
                </ul>
              </div>
            </div>
          </div>
          <div className="mt-8 sm:mt-20 text-center">
            <p className="text-3xl text-gray-900 mt-8">
              You will <span className="bg-gray-900 text-white">save 30 - 60 hours monthly</span> for each project!
            </p>
            <SignUpBtn className="bg-[#ff5c5c] text-white my-5 py-6 px-6">Get started now</SignUpBtn>
          </div>
        </div>
      </div>
    </div>
  )
}
